import PropTypes from 'prop-types'
import React, { memo } from 'react'
import { LongForWrapper } from './style'
import SectionHeader from '@/components/section-header'
import LongforItem from '@/components/longfor-item'
import ScrollView from '@/base-ui/scroll-view'

const HomeLongfor = memo((props) => {
  const { infoData } = props
  return (
    <LongForWrapper>
      <SectionHeader title={ infoData.title } subtitle={ infoData.subtitle }></SectionHeader>
      <div className="longfor-list">
        <ScrollView>
          {
            infoData.list?.map((item, index) => (<LongforItem itemData={item} key={index}></LongforItem>))
          }
        </ScrollView>
      </div>
    </LongForWrapper>
  )
})

HomeLongfor.propTypes = {
  infoData: PropTypes.object
}

export default HomeLongfor